<template>
	<view>
		<Navbar></Navbar>
		<view class="u-m-20 u-m-t-30">
			<view class="u-flex u-row-between">
				<view class="u-flex" @click="dateShow = true">
					<view class="u-m-r-10">{{ date }}</view>
					<u-icon name="arrow-down-fill"></u-icon>
				</view>
				<view class="u-font-34 u-font-bold">{{count}}人</view>
			</view>
			<view class="u-m-t-20" v-for="item in list" :key="item.id">
				<view class="u-form-box u-p-20">
					<view class="u-flex">
						<view>{{item.name}}</view>
						<view class="u-m-l-20 u-tag-box role_tag_one">{{getPresidentName(item.partner_status, item.president_status)}}</view>
					</view>
					<view class="u-m-t-10 u-flex u-row-between">
						<view>推荐人：{{item.reference_name}}</view>
						<view class="u-m-l-20">{{item.president_time}}</view>
					</view>
				</view>
			</view>
		</view>
		<view style="height: 100rpx;"></view>
		<Loadmore :status="status"></Loadmore>
		<Bottom :isReturn="true"></Bottom>

		<!-- 日期 -->
		<u-calendar v-model="dateShow" mode="range" active-bg-color="#B3723E" range-bg-color="#F615" range-color="#fff" btn-type="warning" @change="onChooseDate"></u-calendar>
	</view>
</template>

<script>
	import Navbar from "@/components/Navbar.vue";
	import Bottom from "@/components/Bottom.vue";
	import Loadmore from '@/components/Loadmore.vue'
	import reachBottom from '@/mixins/reachBottom.js'
	import { teaTeamData } from '@/network/tea.js'
	import { TeaStatus } from '@/utils/index.js'
	export default {
		mixins: [reachBottom],
		components: {
			Navbar,
			Bottom,
			Loadmore
		},
		data() {
			return {
				date: '时间筛选',
				dateShow: false,
				startTime: '',
				endTime: '',
				list: []
			}
		},
		onLoad() {
			/* let now = new Date()
			const lastMonth = new Date(now.getFullYear(), now.getMonth() - 1, 1);
			this.startTime = `${lastMonth.getFullYear()}-${(lastMonth.getMonth() + 1).toString().padStart(2, '0')}-01 00:00:00`
			const nowMonth = new Date(now.getFullYear(), now.getMonth() + 1, 0);
			this.endTime = `${nowMonth.getFullYear()}-${(nowMonth.getMonth() + 1).toString().padStart(2, '0')}-${nowMonth.getDate().toString().padStart(2, '0')} 23:59:59` */
			this.onGetList()
		},
		methods:{
			async onGetList(){
				const params = {
					user_id: uni.getStorageSync("user_id"),
					start_time: this.startTime,
					end_time: this.endTime,
					page: this.page,
					limit: 20
				}
				const res = await teaTeamData(params)
				this.count = res.data.count
				res.data.list.map(item=>this.list.push(item))
				if(this.list.length == this.count){
					this.status = 'nomore'
				}
			},
			onChooseDate(val){
				this.startTime = `${val.startDate} 00:00:00`
				this.endTime = `${val.endDate} 23:59:59`
				this.date = `${val.startDate}至${val.endDate}`
				this.page = 1
				this.list = []
				this.onGetList()
			},
			getPresidentName(status1, status2) {
        return TeaStatus(status1, status2)  
				// return PresidentLevel(status)
			},
			loadData(){
				if(this.status == 'nomore')return
				this.page++
				this.status = 'loadmore'
				this.onGetList()
			}
		}
	}
</script>

<style>
	.u-btn--warning{
		background-color: #B3723E !important;
		border-color: #B3723E !important;
	}
</style>